import React, { Component } from "react";
import "./Toggle.less";
import Tabeside from "../../components/tabeside/tabeside";
import { CutsubjectApi, SidebarApi } from "../../request/api";
export default class Toggle extends Component {
  state = {
    // 侧边栏显示初始值
    tabarshow: false,
    // toggle页面数据
    data: [],
    // 侧边栏数据
    sidebardata: []
  };
  render() {
    return (
      <div className="Toggles">
        <div className="top">
          <div className="title">
            <p>
              默认学科 - <span>js学科</span>
            </p>
            <strong>
              设置默认学科
              <i className="iconfont icon-shangxiazuoyouTriangle12"></i>
            </strong>
          </div>
          <div className="objtype">
            <i className="iconfont icon-shangxiazuoyouTriangle14"></i>
            <p onClick={this.opensidebar.bind(this)}>Java面试题</p>
            <i className="iconfont icon-shangxiazuoyouTriangle12"></i>
          </div>
        </div>
        <Tabeside
          tabarshow={this.state.tabarshow}
          closebarside={() => this.setState({ tabarshow: false })}
          subjectdata={this.state.sidebardata}
        />
        <div className="bottom">
          <p>专业科目</p>
          <ul>
            {
              this.state.data.map((item) => {
                return (
                  <li key={item.id}>{item.title}</li>
                )
              })
            }
          </ul>
        </div>
      </div>
    );
  }
  opensidebar() {
    this.setState({
      tabarshow: true,
    });
    SidebarApi().then((res) => {
      //   console.log(res);
      if (res.errCode === 0) {
        console.log(res.data);
        let { data } = res;
        let sidebardata = data
        this.setState({ sidebardata });
      }
    });
  }

  componentDidMount() {
    //发送侧边栏数据请求
    // 获取路由传参
    console.log(this.props.location.state.id);

    CutsubjectApi(
      this.props.location.state.id
    ).then((res) => {
      console.log(res);
      let { data } = res;
      this.setState({ data });
    });

  }
  dataside() {
    console.log("点击了")
    //   侧边栏学科切换请求

  }
}
